<template>
  <el-dialog :visible.sync="dialogVisible" :before-close="cancel">
    <template slot="title">
      <span>举报详情</span>
    </template>

      <el-table :data="tableData.list" v-loading="loading" element-loading-text="加载中...">
        <el-table-column label="举报人账号" prop="account" align="center">
          <template slot-scope="{row}">
            {{row.account || '-'}}
          </template>
        </el-table-column>
        <el-table-column label="举报人昵称" prop="nick" align="center">
           <template slot-scope="{row}">
            {{row.nick || '-'}}
          </template>
        </el-table-column>
        <el-table-column label="举报时间" prop="create_time" align="center">
        </el-table-column>
        <el-table-column label="举报类别" prop="cate" align="center">
        </el-table-column>
    </el-table>
    <div class="pagination-container">
      <el-pagination background @size-change="gridSizeChange" @current-change="gridCurrentChange"
                     :current-page="filters.page" :page-sizes="gridPageSize" :page-size="filters.size"
                     :layout="gridLayout" :total="Number(tableData.total)">
      </el-pagination>
    </div>
  </el-dialog>
</template>

<script>

import { form, grid } from '@/build';
import { getReportNumDetailList } from '@/services/api/chatRoom';

export default {
  name: 'report-dialog',
  props: {
    dialogVisible: {
      required: true,
    },
    rowData: {
      required: true,
    },
    type: { // 可选字段，有默认值 默认只看举报详情
      default: 1,
    },
  },
  mixins: [form, grid],
  data() {
    return {
      filters: {
        id: this.rowData.id,
        page: 1,
        size: 20,
      },
      tableData: [],
    };
  },
  mounted() {
    this.bindGet(getReportNumDetailList, 'tableData', {
      action: 'getGrid',
      sendingData: this.filters,
      afterSuccess: () => {

      },
    });
    this.getAll();
  },
  methods: {
    cancel() {
      this.$emit('cancel');
    },
  },

};
</script>

<style lang="scss" scoped>
 .header{
   padding: 20px 10px 20px 0;
   font-weight: bold;
 }
.ban-content{
  margin-top:-20px;
 }
 .line{
   height:1px;background: #ebeef5;margin:15px 0;
 }

</style>
